<template>
  <div class="app-container">
    <Find :OriginalFilter="{ static: true }" :formList="formList" @findClicked="findClicked" />
    <div class="flex mt10" style="width: 100%; background-color: white">
      <el-card shadow="never" :body-style="{ padding: '5px 10px 5px' }" style="width: 400px">
        <div class="flex" style="flex-direction: column">
          <div>
            <div class="flex AIC">
              <h1 class="f16">选择型体</h1>
              <el-button v-if="JDialogShow" class="ml5" type="primary" size="default" @click="removeCurrentStyle" style="background-color: red"
                >删除当前型体所有工艺</el-button
              >
            </div>
            <Table
              :tableHeader="tableHeader"
              :tableData="tableData"
              :TableHeight="50"
              selection
              class="mt10"
              :isLoading="isLoading"
              @currentRow="currentRow"
              @selectList="selectTableList"
            />
            <PageModule
              :PageData="{ total, pageSizeShow: true, buttonS: true }"
              :layout="'prev, pager'"
              @pageSizeChange="handleSizeChange"
              @pageChange="handleCurrentChange"
            />
          </div>
          <div>
            <div class="flex AIC">
              <h1 class="f16">未取数型体配色</h1>
              <el-input
                style="height: 32px; width: 150px"
                class="toUpperCase ml10"
                v-model="searchStyle"
                size="small"
                placeholder="搜索型体"
              ></el-input>
            </div>
            <Table
              :tableHeader="tableHeader2"
              :tableData="tableData2"
              :TableHeight="50"
              class="mt10"
              :isLoading="isLoading2"
              @currentRow1="currentRow1"
              :outTableHeight="250"
            />
            <PageModule
              :PageData="{ total: total2, pageSizeShow: true, buttonS: true }"
              :layout="'prev, pager'"
              @pageSizeChange="handleSizeChange2"
              @pageChange="handleCurrentChange2"
            />
          </div>
        </div>
      </el-card>
      <el-card shadow="never" :body-style="{ padding: '5px 10px 5px' }" style="flex: 1">
        <div class="flex AIC">
          <h1 class="f16">型体生产工艺</h1>
          <AddOne v-if="JDialogShow" :tableHeader="tableHeader3" :tableData="tableData3" @Save="Save2" @AddHandle="AddHandle2" :unAdd="true" />

          <JDialog
            v-if="JDialogShow"
            :tableHeader="tableHeader3"
            :width="73"
            @removeOne="removeOne"
            :currentTableRow="currentTable3Row"
            @confirm="confirm"
            :unEdit="true"
            :unAdd="true"
            :getOptionList="getCutDeptList"
          />
          <div class="ml20">
            <el-checkbox v-model="checkbox3" label="" @change="checkbox3Change" />
          </div>
          <span class="ml10" style="color: red">有设定生产工艺的部位</span>
        </div>
        <JTable
          :tableHeader="tableHeader3"
          :tableData="tableData3"
          class="mt10"
          @currentRow="currentRow3"
          @selectValChange="selectValChange3"
          :isLoading="isLoading3"
        />
        <PageModule
          :PageData="{ total: total3, pageSizeShow: true, buttonS: true }"
          :layout="'prev, pager'"
          @pageSizeChange="handleSizeChange3"
          @pageChange="handleCurrentChange3"
        />
      </el-card>
    </div>

    <el-drawer v-model="drawer" :direction="'ttb'" size="small" :with-header="false">
      <span @click="drawer = false" style="float: right; cursor: pointer; color: rgb(7, 7, 7)">X</span>
      <div class="flex AIC" style="flex-direction: column">
        <Find :OriginalFilter="{ static: true }" :searchImg="false" :formList="formList10" @findClicked="findClicked10" />
        <div class="flex mt10 JCC" style="width: 100%; background-color: white">
          <el-card shadow="never" :body-style="{ padding: '5px 10px 5px' }">
            <h1 class="f16">选择外发指令</h1>
            <Table
              :tableHeader="tableHeader10"
              :tableData="tableData10"
              selection
              class="mt10"
              :outTableHeight="150"
              @selectList="selectTableList10"
              @currentRow="currentRow10"
            />
          </el-card>
        </div>
      </div>
    </el-drawer>

    <!-- 复制 -->
    <el-dialog v-model="copyDialog" title="指令复制" width="30%">
      <div class="flex AIC">
        <el-form-item label="型体">
          <el-input style="width: 200px" v-model="currentStyle" disabled></el-input>
        </el-form-item>
        <el-form-item label="颜色" class="ml20">
          <el-input style="width: 200px" v-model="currentColor" disabled></el-input>
        </el-form-item>
      </div>
      <h3 class="mb18">复制：</h3>
      <div class="flex AIC">
        <el-form-item label="型体">
          <el-input style="width: 200px" v-model="currentStyle" disabled></el-input>
        </el-form-item>
        <el-form-item label="颜色" class="ml20">
          <el-select style="width: 200px" v-model="copyColor">
            <el-option v-for="item in copyColorOptions" :key="item.value" :label="item.label" :value="item.value"> </el-option>
          </el-select>
        </el-form-item>
      </div>
      <el-button type="primary" class="primaryBth" @click="clickCopyBtn" style="float: right">复制</el-button>
    </el-dialog>

    <!-- 更新部位差异 -->
    <el-drawer v-model="drawer2" :direction="'ttb'" size="small" :with-header="false">
      <span @click="drawer2 = false" style="float: right; cursor: pointer; color: rgb(7, 7, 7)">X</span>
      <div class="flex AIC" style="flex-direction: column">
        <div class="flex mt10 JCC" style="width: 100%; background-color: white">
          <el-card shadow="never" :body-style="{ padding: '5px 10px 5px' }">
            <Find :OriginalFilter="{ static: true }" :searchImg="false" :formList="formList11" />
            <div class="flex mt10">
              <h1 class="f16">待更新部位</h1>
              <AddOne :tableHeader="tableHeader11" :tableData="tableData11" @Save="Save11" :unAdd="true" />
              <JDialog
                :tableHeader="tableHeader11"
                :width="73"
                @removeOne="removeOne11"
                :currentTableRow="currentTable11Row"
                @confirm="confirm11"
                :unEdit="true"
                :unAdd="true"
                :getOptionList="getCutDeptList"
              />
            </div>
            <JTable
              selection
              @selectList="selectTableList11"
              :tableHeader="tableHeader11"
              :tableData="tableData11"
              class="mt10"
              :outTableHeight="150"
              @currentRow="currentRow11"
            />
          </el-card>
        </div>
      </div>
    </el-drawer>

    <!-- 工艺更改记录 -->
    <el-drawer v-model="drawer3" :direction="'ttb'" size="small" :with-header="false">
      <span @click="drawer3 = false" style="float: right; cursor: pointer; color: rgb(7, 7, 7)">X</span>
      <div class="flex AIC" style="flex-direction: column">
        <div class="flex mt10 JCC" style="width: 100%; background-color: white">
          <el-card shadow="never" :body-style="{ padding: '5px 10px 5px' }">
            <h1 class="f16">工艺更改记录</h1>
            <Table :tableHeader="tableHeader12" :tableData="tableData12" class="mt10" :outTableHeight="150" />
            <PageModule :PageData="{ total: total12, buttonS: true }" @pageSizeChange="handleSizeChange12" @pageChange="handleCurrentChange12" />
          </el-card>
        </div>
      </div>
    </el-drawer>
  </div>
</template>
<script lang="ts">
import { defineComponent } from 'vue'
import type { formListType } from '@/components/Find/index.vue'
import LoginWork from '@/utils/LoginWork'
import { formateData } from '@/plugins/mixinJ'
import fileRequest from '@/utils/fileRequest'
import { onBeforeUnmount } from 'vue'
import JMessage from '@/utils/JMessage'
export default defineComponent({
  name: 'MoldingProcessL'
})
</script>
<script lang="ts" setup>
import { i18n, Jzhcn } from '@/i18n'
import { ElMessage, ElMessageBox } from 'element-plus'
import service from '@/utils/request'
import { debounce, throttle } from 'lodash'
import { onMounted, watch } from 'vue'
import { ref } from 'vue'
import zhCn from '@/i18n/zh-cn.json'

// Dialog模块
const dialogStyle = ref('')
const dialogColorCode = ref('')
const dialogColorName = ref('')
const tableData13 = ref([]) as any
const isLoading13 = ref(false)
const currentPage13 = ref(1)
const pageSize13 = ref(40)
const total13 = ref(0)

const getTableList13 = async () => {
  isLoading13.value = true
  const res = await service.post<any, any>(`/sdStyle/getUnProcessStyle?choose=${4}`, {
    color: dialogColorName.value,
    colorCode: dialogColorCode.value,
    pageNum: currentPage13.value,
    pageSize: pageSize13.value,
    style: dialogStyle.value
  })
  tableData13.value = res.list
  total13.value = res.total
  isLoading13.value = false
}
const dialog = ref(false)

watch([dialogStyle, dialogColorCode, dialogColorName], (val) => {
  getTableList13()
})

const copyDialog = ref(false)
const drawer3 = ref(false)
const checkbox3 = ref(false)
const currentStyle = ref('')
const currentColor = ref('')
const copyColor = ref('')
const copyColorOptions = ref([]) as any
const formList = ref([
  {
    type: 'input',
    inputPlaceholder: '请输入型体',
    inputValue: ''
  },
  {
    type: 'input',
    inputPlaceholder: '请输入颜色',
    inputValue: ''
  },
  {
    type: 'input',
    inputPlaceholder: '请输入颜色代码',
    inputValue: ''
  },
  {
    type: 'button',
    checkboxLabel: '取资料'
  },
  {
    type: 'button',
    checkboxLabel: '复制'
  },
  {
    type: 'button',
    checkboxLabel: '置空',
    bgColor: '#1890FF'
  },
  {
    type: 'button',
    checkboxLabel: '工艺辅助生成'
  },
  {
    type: 'button',
    checkboxLabel: '更新部位差异'
  },
  {
    type: 'button',
    checkboxLabel: '裁次辅助生成'
  },
  {
    type: 'button',
    checkboxLabel: '工艺更改记录'
  },
  {
    type: 'button',
    checkboxLabel: '导出工艺'
  }
]) as any

const imgList = ref([])
const imgList2 = ref([])

const tableHeader = ref([
  {
    backgroundColor: true,
    label: '型体',
    prop: 'style'
  },
  {
    backgroundColor: true,
    label: '颜色',
    prop: 'color'
  },
  {
    label: '颜色代码',
    prop: 'colorCode'
  },
  {
    label: '图片',
    fixed: true,
    type: 'img',
    prop: 'photoPath',
    srcList: imgList
  }
])
const tableHeader2 = ref([
  {
    backgroundColor: true,
    label: '型体',
    prop: 'style'
  },
  {
    backgroundColor: true,
    label: '颜色',
    prop: 'color'
  },
  {
    label: '颜色代码',
    prop: 'colorCode'
  },
  {
    label: '图片',
    fixed: true,
    type: 'img',
    prop: 'photoPath',
    srcList: imgList2
  }
])
const processOptions = ref([]) as any // 工艺下拉框数据
const cutsOptions = ref([]) as any // 裁次下拉框数据
const deptsOptions = ref([]) as any // 入库部门下拉框数据

const tableData11 = ref([])
const tableHeader11 = ref([
  {
    change: true,
    width: 50,
    label: '序号',
    prop: 'seqNo'
  },
  {
    change: true,
    width: 100,
    label: '型体',
    prop: 'style'
  },
  {
    change: true,
    label: '颜色',
    prop: 'styleColor'
  },
  {
    change: true,
    width: 140,
    label: '部位',
    prop: 'partName'
  },
  {
    width: 140,
    change: true,
    label: '材料',
    prop: 'mtlName'
  },
  {
    change: true,
    width: 50,
    label: '规格',
    prop: 'mtlSpec'
  },
  {
    change: true,
    label: '单位',
    prop: 'mtlUnit'
  },
  {
    label: '裁层',
    prop: 'cutLayer'
  },
  {
    label: '每刀片数',
    prop: 'cutNum2'
  },
  {
    label: '每双片数',
    prop: 'cutNum'
  },
  {
    disableBC: true,
    width: 150,
    disable: true,
    label: '入库部门',
    prop: 'stkFlag',
    type: 'select',
    allowCreate: false,
    options: deptsOptions
  },
  {
    disableBC: true,
    disable: true,
    type: 'select',
    label: '工艺1',
    prop: 'process1',

    allowCreate: false,
    options: processOptions
  },
  {
    disableBC: true,
    disable: true,
    type: 'select',
    label: '工艺2',
    prop: 'process2',

    allowCreate: false,
    options: processOptions
  },
  {
    disableBC: true,
    disable: true,
    type: 'select',
    label: '工艺3',
    prop: 'process3',

    allowCreate: false,
    options: processOptions
  },
  {
    disableBC: true,
    disable: true,
    type: 'select',
    label: '工艺4',
    prop: 'process4',

    allowCreate: false,
    options: processOptions
  },
  {
    disableBC: true,
    disable: true,
    type: 'select',
    label: '工艺5',
    prop: 'process5',

    allowCreate: false,
    options: processOptions
  },
  {
    disableBC: true,
    disable: true,
    type: 'select',
    label: '工艺6',
    prop: 'process6',

    allowCreate: false,
    options: processOptions
  },
  {
    disableBC: true,
    disable: true,
    type: 'select',
    label: '工艺7',
    prop: 'process7',

    allowCreate: false,
    options: processOptions
  },
  {
    disableBC: true,
    disable: true,
    type: 'select',
    label: '工艺8',
    prop: 'process8',

    allowCreate: false,
    options: processOptions
  },
  {
    disableBC: true,
    disable: true,
    type: 'select',
    label: '工艺9',
    prop: 'process9',

    allowCreate: false,
    options: processOptions
  },
  {
    disableBC: true,
    disable: true,
    type: 'select',
    label: '工艺10',
    prop: 'process10',

    allowCreate: false,
    options: processOptions
  },
  {
    label: '备注',
    prop: 'remark'
  }
])
const tableData12 = ref([])
const tableHeader12 = ref([
  {
    width: 100,
    label: '型体',
    prop: 'style'
  },
  {
    width: 140,
    label: '操作时间',
    prop: 'sysTime'
  },
  {
    label: '操作',
    prop: 'sysUser'
  },
  {
    label: '序号',
    prop: 'seqNo'
  },
  {
    label: '部位',
    prop: 'partName'
  },
  {
    width: 150,
    label: '材料',
    prop: 'mtlName'
  },
  {
    label: '规格',
    prop: 'mtlSpec'
  },
  {
    width: 50,
    label: '单位',
    prop: 'mtlUnit'
  },
  {
    label: '裁层',
    prop: 'cutLayer'
  },
  {
    label: '每刀片数',
    prop: 'cutNum2'
  },
  {
    label: '每双片数',
    prop: 'cutNum'
  },
  {
    width: 150,
    label: '入库仓库',
    prop: 'stkFlag'
  },
  {
    label: '工艺1',
    prop: 'process1'
  },
  {
    label: '工艺2',
    prop: 'process2'
  },
  {
    label: '工艺3',
    prop: 'process3'
  },
  {
    label: '工艺4',
    prop: 'process4'
  },
  {
    label: '工艺5',
    prop: 'process5'
  },
  {
    label: '工艺6',
    prop: 'process6'
  },
  {
    label: '工艺7',
    prop: 'process7'
  },
  {
    label: '工艺8',
    prop: 'process8'
  },
  {
    label: '工艺9',
    prop: 'process9'
  },
  {
    label: '工艺10',
    prop: 'process10'
  }
])
const handleSizeChange12 = (val: number) => {
  pageSize12.value = val
  getTableList12()
}
const handleCurrentChange12 = (val: number) => {
  currentPage12.value = val
  getTableList12()
}
const currentPage12 = ref(1)
const pageSize12 = ref(40)
const total12 = ref(0)
const selectedLists = ref([])
const selectTableList = (selectedList: any) => {
  selectedLists.value = selectedList
}
// 表一模块
const findClicked = async (content: string) => {
  if (content === '置空') {
    formList.value.forEach((item: any) => {
      item.inputValue = ''
      item.selectValue = ''
      item.dateValue = ''
    })
    getTableList()
    getTableList2()
  }
  if (content === '取资料') {
    if (
      formList.value.find(
        (item: any) => item.inputPlaceholder && Jzhcn.Find[item.inputPlaceholder.split('.')[1] as keyof typeof Jzhcn.Find] === '请输入型体'
      )?.inputValue === '' ||
      formList.value.find(
        (item: any) => item.inputPlaceholder && Jzhcn.Find[item.inputPlaceholder.split('.')[1] as keyof typeof Jzhcn.Find] === '请输入颜色'
      )?.inputValue === ''
      // formList.value.find((item: any) => item.inputPlaceholder && Jzhcn.Find[item.inputPlaceholder.split('.')[1] as keyof typeof Jzhcn.Find] === '请输入颜色代码')?.inputValue === ''
    ) {
      JMessage.error('请先输入工厂型体 颜色名称')
      return
    }
    if (tableData2.value.length === 0) {
      JMessage.error('无数据可以取资料')
      return
    }
    const res = (await LoginWork.post('/sdStyle/insertProcess', {
      color:
        formList.value.find(
          (item: any) => item.inputPlaceholder && Jzhcn.Find[item.inputPlaceholder.split('.')[1] as keyof typeof Jzhcn.Find] === '请输入颜色'
        )?.inputValue || '',
      colorCode:
        formList.value.find(
          (item: any) => item.inputPlaceholder && Jzhcn.Find[item.inputPlaceholder.split('.')[1] as keyof typeof Jzhcn.Find] === '请输入颜色代码'
        )?.inputValue || '',
      style:
        formList.value.find(
          (item: any) => item.inputPlaceholder && Jzhcn.Find[item.inputPlaceholder.split('.')[1] as keyof typeof Jzhcn.Find] === '请输入型体'
        )?.inputValue || '',
      pageNum: currentPage.value,
      pageSize: pageSize.value
    })) as any
    if (res.code === 200) {
      JMessage.success(res.message)
      setTimeout(() => {
        getTableList()
        getTableList2()
        getTableList3()
      }, 500)
    } else {
      JMessage.error(res.message)
    }
  }
  if (content === '复制') {
    copyDialog.value = true
    currentStyle.value = currentTableRow.value.style || ''
    currentColor.value = currentTableRow.value.color || ''
    copyColor.value = ''
    let res = (await service.post(`/sdStyle/getUnProcessStyle?choose=${2}`, {
      color: '',
      colorCode: '',
      style: currentTableRow.value.style || '',
      pageNum: 1,
      pageSize: 100
    })) as any
    copyColorOptions.value = res.list.map((item: any) => {
      return {
        value: `${item.color}`,
        label: item.color
      }
    })
  }
  if (content === '工艺辅助生成') {
    const res = (await LoginWork.post(`/sdStyle/creatCutAndProcess?choose=${1}`, {
      color: currentTableRow.value.color,
      colorCode: currentTableRow.value.colorCode || '',
      style: currentTableRow.value.style,
      companyId: currentTableRow.value.companyId,
      pageNum: '',
      pageSize: ''
    })) as any
    if (res.code === 200) {
      JMessage.success('工艺辅助生成成功')
      getTableList3()
    } else {
      JMessage.error(res.message)
    }
  }
  if (content === '更新部位差异') {
    drawer2.value = true
    getSiteDifferenceList()
  }
  if (content === '裁次辅助生成') {
    const res = (await LoginWork.post(`/sdStyle/creatCutAndProcess?choose=${2}`, {
      color: currentTableRow.value.color,
      colorCode: currentTableRow.value.colorCode || '',
      style: currentTableRow.value.style,
      pageNum: '',
      pageSize: ''
    })) as any
    if (res.code === 200) {
      JMessage.success('裁次辅助生成成功')
      getTableList3()
    } else {
      JMessage.error('裁次辅助生成失败')
    }
  }
  if (content === '工艺更改记录') {
    getTableList12()
  }
  if (content === '导出工艺') {
    if (selectedLists.value.length === 0) {
      JMessage.error('请勾选数据')
      return
    }
    const res = (await fileRequest.post(`/sdStyle/downloadStyleProcess`, selectedLists.value)) as any
    const link = document.createElement('a') // 利用a标签自定义下载文件名
    let blob = new Blob([res.data]) // 创建Blob对象，设置文件类型
    link.style.display = 'none'
    //设置连接
    link.href = window.URL.createObjectURL(blob)
    const FileName = decodeURI(res.headers['content-disposition'].split(`utf-8''`)[1])
    link.download = FileName //自定义文件名字
    document.body.appendChild(link)
    //模拟点击事件
    link.click()
    document.body.removeChild(link)
  }
}
// 点击表给另一张表传数据
const currentTable11Row = ref({}) as any
const currentRow11 = async (row: any = tableData11.value[0]) => {
  if (row) {
    row.addAndUpdate = true
    if (currentTable11Row.value !== row) currentTable11Row.value.addAndUpdate = false
    currentTable11Row.value = row
  }
}

const formList11 = ref([
  {
    type: 'input',
    inputPlaceholder: '请输入型体',
    inputValue: ''
  },
  {
    type: 'input',
    inputPlaceholder: '请输入颜色',
    inputValue: ''
  }
]) as any
// 更新部位差异查询
const getSiteDifferenceList = debounce(async (second: boolean = false) => {
  if (!second) {
    formList11.value.find(
      (item: any) => item.inputPlaceholder && Jzhcn.Find[item.inputPlaceholder.split('.')[1] as keyof typeof Jzhcn.Find] === '请输入型体'
    ).inputValue = currentTableRow.value.style
    formList11.value.find(
      (item: any) => item.inputPlaceholder && Jzhcn.Find[item.inputPlaceholder.split('.')[1] as keyof typeof Jzhcn.Find] === '请输入颜色'
    ).inputValue = currentTableRow.value.color
  }
  const res = (await LoginWork.post(
    `/sdStyle/renewalSiteDifferenceList?style=${
      formList11.value.find(
        (item: any) => item.inputPlaceholder && Jzhcn.Find[item.inputPlaceholder.split('.')[1] as keyof typeof Jzhcn.Find] === '请输入型体'
      )?.inputValue
    }&color=${
      formList11.value.find(
        (item: any) => item.inputPlaceholder && Jzhcn.Find[item.inputPlaceholder.split('.')[1] as keyof typeof Jzhcn.Find] === '请输入颜色'
      ).inputValue
    }&companyId=${currentTableRow.value.companyId}`
  )) as any
  tableData11.value = res.data
  currentRow11()
}, 500)
watch(
  () =>
    formList11.value.map((item: any) => {
      item.selectValue, item.inputValue, item.dateValue, item.checked
    }),
  () => {
    getSiteDifferenceList(true)
  }
)
// 工艺更改记录查询
const getTableList12 = async () => {
  const style = formList.value.find(
    (item: any) => item.inputPlaceholder && Jzhcn.Find[item.inputPlaceholder.split('.')[1] as keyof typeof Jzhcn.Find] === '请输入型体'
  ).inputValue
  const color = formList.value.find(
    (item: any) => item.inputPlaceholder && Jzhcn.Find[item.inputPlaceholder.split('.')[1] as keyof typeof Jzhcn.Find] === '请输入颜色'
  ).inputValue
  const colorCode = formList.value.find(
    (item: any) => item.inputPlaceholder && Jzhcn.Find[item.inputPlaceholder.split('.')[1] as keyof typeof Jzhcn.Find] === '请输入颜色代码'
  ).inputValue
  if (!style) {
    JMessage.error('请输入工厂型体')
    return
  }
  drawer3.value = true
  const res = (await service.post(`/sdStyle/processUpdateRecord?pageNum=${currentPage12.value}&pageSize=${pageSize12.value}&style=${style}`)) as any
  total12.value = res.total
  tableData12.value = res.list
  // tableData12.value = res.data
}
// 点击复制按钮
const clickCopyBtn = async () => {
  const res = (await LoginWork.get(
    `/sdStyle/copyStyleProcess?style1=${encodeURIComponent(currentStyle.value)}&style2=${encodeURIComponent(
      currentStyle.value
    )}&color1=${encodeURIComponent(currentColor.value)}&color2=${encodeURIComponent(copyColor.value)}`
  )) as any
  if (res.code === 200) {
    JMessage.success('复制成功')
    formList.value.find(
      (item: any) => item.inputPlaceholder && Jzhcn.Find[item.inputPlaceholder.split('.')[1] as keyof typeof Jzhcn.Find] === '请输入型体'
    ).inputValue = `${currentStyle.value}`
    formList.value.find(
      (item: any) => item.inputPlaceholder && Jzhcn.Find[item.inputPlaceholder.split('.')[1] as keyof typeof Jzhcn.Find] === '请输入颜色'
    ).inputValue = `${copyColor.value}`
    getTableList()
    getTableList2()
    getTableList3()
  } else {
    JMessage.error('复制失败')
  }
  copyDialog.value = false
}
const tableData = ref([])
const isLoading = ref(true)
// 分页器
const currentPage = ref(1)
const pageSize = ref(40)
const total = ref(0)
const handleSizeChange = (val: number) => {
  pageSize.value = val
  getTableList()
}
const handleCurrentChange = (val: number) => {
  currentPage.value = val
  getTableList()
}
const searchStyle = ref('')
// 获取表一数据
const getTableList = async () => {
  isLoading.value = true
  let tableDataList = (await LoginWork.post(`/sdStyle/getUnProcessStyle?choose=${2}`, {
    color:
      formList.value.find(
        (item: any) => item.inputPlaceholder && Jzhcn.Find[item.inputPlaceholder.split('.')[1] as keyof typeof Jzhcn.Find] === '请输入颜色'
      )?.inputValue || '',
    colorCode:
      formList.value.find(
        (item: any) => item.inputPlaceholder && Jzhcn.Find[item.inputPlaceholder.split('.')[1] as keyof typeof Jzhcn.Find] === '请输入颜色代码'
      )?.inputValue || '',
    style:
      formList.value.find(
        (item: any) => item.inputPlaceholder && Jzhcn.Find[item.inputPlaceholder.split('.')[1] as keyof typeof Jzhcn.Find] === '请输入型体'
      )?.inputValue || '',
    pageNum: currentPage.value,
    pageSize: pageSize.value
  })) as any
  isLoading.value = false
  if (tableDataList.data) {
    imgList.value = tableDataList.data.list.map((item: any) => {
      if (tableDataList.isVietName && item.photoPath) {
        item.photoPath = item.photoPath.replace('http://192.168.1.220:9000', 'http://10.1.1.40:9001')
      }
      return item.photoPath
    })
    tableData.value = tableDataList.data.list.map((item: any) => {
      item.backgroundColor = item.cfmFlag
      return item
    })
    total.value = tableDataList.data.total
    currentRow()
  }
}
watch(
  () =>
    formList.value.map((item: any) => {
      item.selectValue, item.inputValue, item.dateValue, item.checked
    }),
  () => {
    getTableList()
  }
)
watch(searchStyle, () => {
  getTableList2()
})
onMounted(() => {
  getTableList()
  getSiteDifferenceList()
})
// 点击表给另一张表传数据
const JDialogShow = ref(true)
const currentTableRow = ref({}) as any
const currentRow = async (row: any = tableData.value[0] ? tableData.value[0] : {}) => {
  currentTableRow.value = row
  getTableList3()
  if (row.cfmFlag === '#80FF00') {
    JDialogShow.value = false
  } else {
    JDialogShow.value = true
  }
}

// 表二模块
const tableData2 = ref([])
const isLoading2 = ref(true)
// 分页器
const currentPage2 = ref(1)
const pageSize2 = ref(40)
const total2 = ref(0)
const handleSizeChange2 = (val: number) => {
  pageSize2.value = val
  getTableList2()
}
const handleCurrentChange2 = (val: number) => {
  currentPage2.value = val
  getTableList2()
}
// 获取表数据
const getTableList2 = debounce(async () => {
  isLoading2.value = true
  let tableDataList = (await LoginWork.post(`/sdStyle/getUnProcessStyle?choose=${1}`, {
    color: '',
    colorCode: '',
    style: searchStyle.value || '',
    pageNum: currentPage2.value,
    pageSize: pageSize2.value
  })) as any
  isLoading2.value = false
  imgList2.value = tableDataList.data.list.map((item: any) => {
    if (tableDataList.isVietName && item.photoPath) {
      item.photoPath = item.photoPath.replace('http://192.168.1.220:9000', 'http://10.1.1.40:9001')
    }
    return item.photoPath
  })
  tableData2.value = tableDataList.data.list
  total2.value = tableDataList.total
  // currentRow2()
}, 500)
onMounted(() => {
  getTableList2()
})
// 表二双击事件
const currentRow1 = async (row: any) => {
  // 将数据给select
  formList.value.find(
    (item: any) => item.inputPlaceholder && Jzhcn.Find[item.inputPlaceholder.split('.')[1] as keyof typeof Jzhcn.Find] === '请输入型体'
  ).inputValue = row.style
  formList.value.find(
    (item: any) => item.inputPlaceholder && Jzhcn.Find[item.inputPlaceholder.split('.')[1] as keyof typeof Jzhcn.Find] === '请输入颜色'
  ).inputValue = row.color
  formList.value.find(
    (item: any) => item.inputPlaceholder && Jzhcn.Find[item.inputPlaceholder.split('.')[1] as keyof typeof Jzhcn.Find] === '请输入颜色代码'
  ).inputValue = row.colorCode
  getTableList()
}

// 表三模块
const formList10 = ref([
  {
    type: 'input',
    inputPlaceholder: '请输入序号',
    inputValue: ''
  },
  {
    type: 'input',
    inputPlaceholder: '请输入外加工项目',
    inputValue: ''
  },
  {
    type: 'button',
    checkboxLabel: '插入'
  }
])
const tableHeader3 = ref([
  {
    change: true,
    width: 50,
    label: '序号',
    prop: 'seqNo'
  },
  {
    change: true,
    label: '部位名称',
    prop: 'partName'
  },
  {
    width: 180,
    label: '材料名称',
    prop: 'mtlName'
  },
  {
    change: true,
    label: '材料规格',
    prop: 'mtlSpec'
  },
  {
    label: '材料单位',
    prop: 'mtlUnit'
  },
  {
    width: 50,
    label: '裁层',
    prop: 'cutLayer'
  },
  {
    width: 50,
    label: '每双片数',
    prop: 'cutNum'
  },
  {
    width: 50,
    label: '每刀片数',
    prop: 'cutNum2'
  },
  {
    backgroundColor: true,
    disableBC: false,
    width: 80,
    disable: true,
    label: '裁次',
    prop: 'cutSeq',
    type: 'select',
    allowCreate: false,
    options: cutsOptions
  },
  {
    disableBC: true,
    width: 100,
    disable: true,
    label: '入库部门',
    prop: 'stkFlag',
    type: 'select',
    allowCreate: false,
    options: deptsOptions
  },
  {
    disableBC: true,
    disable: true,
    type: 'select',
    label: '工艺1',
    prop: 'process1',
    width: 90,
    allowCreate: false,
    options: processOptions
  },
  {
    disableBC: true,
    disable: true,
    type: 'select',
    label: '工艺2',
    width: 90,
    allowCreate: false,
    prop: 'process2',
    options: processOptions
  },
  {
    disableBC: true,
    disable: true,
    type: 'select',
    label: '工艺3',
    width: 90,
    allowCreate: false,
    prop: 'process3',
    options: processOptions
  },
  {
    disableBC: true,
    disable: true,
    type: 'select',
    label: '工艺4',
    width: 90,
    prop: 'process4',
    allowCreate: false,
    options: processOptions
  },
  {
    disableBC: true,
    disable: true,
    type: 'select',
    label: '工艺5',
    width: 90,
    prop: 'process5',
    allowCreate: false,
    options: processOptions
  },
  {
    disableBC: true,
    disable: true,
    type: 'select',
    label: '工艺6',
    width: 90,
    prop: 'process6',
    allowCreate: false,
    options: processOptions
  },
  {
    disableBC: true,
    disable: true,
    type: 'select',
    label: '工艺7',
    width: 90,
    prop: 'process7',
    allowCreate: false,
    options: processOptions
  },
  {
    disableBC: true,
    disable: true,
    type: 'select',
    label: '工艺8',
    width: 90,
    allowCreate: false,
    prop: 'process8',
    options: processOptions
  },
  {
    disableBC: true,
    disable: true,
    type: 'select',
    label: '工艺9',
    width: 90,
    allowCreate: false,
    prop: 'process9',
    options: processOptions
  },
  {
    disableBC: true,
    disable: true,
    type: 'select',
    label: '工艺10',
    width: 90,
    allowCreate: false,
    prop: 'process10',
    options: processOptions
  },
  {
    label: '备注',
    prop: 'remark'
  }
])
const tableData3 = ref([]) as any
const isLoading3 = ref(true)
// 分页器
const currentPage3 = ref(1)
const pageSize3 = ref(60)
const total3 = ref(0)
const handleSizeChange3 = (val: number) => {
  pageSize3.value = val
  getTableList3()
}
const handleCurrentChange3 = (val: number) => {
  currentPage3.value = val
  getTableList3()
}
// 获取表数据
const getTableList3 = async () => {
  isLoading3.value = true
  let tableDataList = (await LoginWork.post(`/sdStyle/getStyleProductionList`, {
    ...currentTableRow.value,
    pageNum: currentPage3.value,
    pageSize: pageSize3.value
  })) as any
  isLoading3.value = false
  tableData3.value = tableDataList.data.map((item: any) => {
    if (item.cutSeq === (zhCn.Print as any).FirstCut) {
      item.backgroundColor = '#FF8080'
    }
    if (item.cutSeq === (zhCn.Print as any).SecondCut) {
      item.backgroundColor = '#80E0E0'
    }
    if (item.cutSeq === (zhCn.Print as any).ThirdCut) {
      item.backgroundColor = '#FFE000'
    }
    if (item.cutSeq === '四裁') {
      item.backgroundColor = '#EAEFF5'
    }
    item.disableConfirm = true

    // 多语言
    if (item.partName) {
      item.partName1 = item.partName.key
      item.partName = item.partName.value
    }
    if (item.process1) {
      item.process01 = item.process1.key
      item.process001 = item.process1.value
      item.process1 = item.process1.value
    }
    if (item.process2) {
      item.process02 = item.process2.key
      item.process002 = item.process2.value
      item.process2 = item.process2.value
    }
    if (item.process3) {
      item.process03 = item.process3.key
      item.process003 = item.process3.value
      item.process3 = item.process3.value
    }
    if (item.process4) {
      item.process04 = item.process4.key
      item.process004 = item.process4.value
      item.process4 = item.process4.value
    }
    if (item.process5) {
      item.process05 = item.process5.key
      item.process005 = item.process5.value
      item.process5 = item.process5.value
    }
    if (item.process6) {
      item.process06 = item.process6.key
      item.process006 = item.process6.value
      item.process6 = item.process6.value
    }
    if (item.process7) {
      item.process07 = item.process7.key
      item.process007 = item.process7.value
      item.process7 = item.process7.value
    }
    if (item.process8) {
      item.process08 = item.process8.key
      item.process008 = item.process8.value
      item.process8 = item.process8.value
    }
    if (item.process9) {
      item.process09 = item.process9.key
      item.process009 = item.process9.value
      item.process9 = item.process9.value
    }
    if (item.process10) {
      item.process010 = item.process10.key
      item.process0010 = item.process10.value
      item.process10 = item.process10.value
    }
    return item
  })
  currentRow3()
}
// 点击表给另一张表传数据
const currentTable3Row = ref({}) as any
const currentRow3 = async (row: any = tableData3.value[0]) => {
  if (currentTableRow.value.cfmFlag !== '#80FF00') row.addAndUpdate = true
  currentTable3Row.value = row
  // 多语言
  currentTableRow.value.partName = currentTableRow.value.partName1
  currentTableRow.value.process1 = currentTableRow.value.process01
  currentTableRow.value.process2 = currentTableRow.value.process02
  currentTableRow.value.process3 = currentTableRow.value.process03
  currentTableRow.value.process4 = currentTableRow.value.process04
  currentTableRow.value.process5 = currentTableRow.value.process05
  currentTableRow.value.process6 = currentTableRow.value.process06
  currentTableRow.value.process7 = currentTableRow.value.process07
  currentTableRow.value.process8 = currentTableRow.value.process08
  currentTableRow.value.process9 = currentTableRow.value.process09
  currentTableRow.value.process10 = currentTableRow.value.process10
}
const selectValChange3 = (row: any, item2: any) => {
  const arr = [] as any
  for (const key in row) {
    if (
      key === 'process01' ||
      key === 'process02' ||
      key === 'process03' ||
      key === 'process04' ||
      key === 'process05' ||
      key === 'process06' ||
      key === 'process07' ||
      key === 'process08' ||
      key === 'process09' ||
      (key === 'process10' && row[key] !== null)
    ) {
      arr.push(row[key])
    }
  }
  let isRepeat = 0
  arr.forEach((item: any) => {
    if (item.includes(item2)) {
      isRepeat++
    }
  })
  if (isRepeat === 2) {
    JMessage.error('工艺重复')
    for (const key in row) {
      if (
        key === 'process01' ||
        key === 'process02' ||
        key === 'process03' ||
        key === 'process04' ||
        key === 'process05' ||
        key === 'process06' ||
        key === 'process07' ||
        key === 'process08' ||
        key === 'process09' ||
        (key === 'process10' && row[key] === item2)
      ) {
        row[key] = ''
      }
    }
  }
}
// 有设定生产工艺的部位
const checkbox3Change = async (val: any) => {
  checkbox3.value = val
  if (val === true) {
    isLoading3.value = true
    let tableDataList = (await LoginWork.post(`/sdStyle/getStyleProductionList?flag=${1}`, {
      ...currentTableRow.value,
      pageNum: currentPage3.value,
      pageSize: pageSize3.value
    })) as any
    isLoading3.value = false
    tableData3.value = tableDataList.data.map((item: any) => {
      if (item.cutSeq === '一裁') {
        item.backgroundColor = '#FF8080'
      }
      if (item.cutSeq === '二裁') {
        item.backgroundColor = '#80E0E0'
      }
      if (item.cutSeq === '三裁') {
        item.backgroundColor = '#FFE000'
      }
      if (item.cutSeq === '四裁') {
        item.backgroundColor = '#EAEFF5'
      }
      item.disable = true
      return item
    })
    currentRow3()
  } else {
    getTableList3()
  }
}
const AddHandle2 = (obj: any) => {
  obj.seqNo = tableData3.value.length
}
const Save2 = async (arr: any, deleteArr: any) => {
  console.log(tableData3.value)
  const res = (await LoginWork.post(
    '/sdStyle/updatePcStyleProcess',
    tableData3.value.map((item: any) => {
      console.log(item)
      if (item.process01 && item.process1 !== '' && item.process1 === item.process001) {
        item.process1 = item.process01
      }
      if (item.process02 && item.process2 !== '' && item.process2 === item.process002) {
        item.process2 = item.process02
      }
      if (item.process03 && item.process3 !== '' && item.process3 === item.process003) {
        item.process3 = item.process03
      }
      if (item.process04 && item.process4 !== '' && item.process4 === item.process004) {
        item.process4 = item.process04
      }
      if (item.process05 && item.process5 !== '' && item.process5 === item.process005) {
        item.process5 = item.process05
      }
      if (item.process06 && item.process6 !== '' && item.process6 === item.process006) {
        item.process6 = item.process06
      }
      if (item.process07 && item.process7 !== '' && item.process7 === item.process007) {
        item.process7 = item.process07
      }
      if (item.process08 && item.process8 !== '' && item.process8 === item.process008) {
        item.process8 = item.process08
      }
      if (item.process09 && item.process9 !== '' && item.process9 === item.process009) {
        item.process9 = item.process09
      }
      if (item.process010 && item.process10 !== '' && item.process10 === item.process0010) {
        item.process10 = item.process010
      }
      return item
    })
  )) as any
  // 判断请求是否成功
  if (res.code === 200) {
    JMessage.success(res.message)
    getTableList3()
    deleteArr()
  } else {
    JMessage.error(res.message)
  }
}

// JDialog的确认按钮
// Dialog确认添加/修改按钮
const confirm = async (obj: any, dialogVisible: any, title: any) => {
  // 打印出obj的值
  const tempList = formateData([obj]) as any
  const { style, color } = currentTableRow.value
  // 向服务器发送请求，更新外派单信息
  if (title === '添加') {
    const res = (await LoginWork.post(`/sdStyle/optionStyleProcess?choose=${1}&style=${style}&styleColor=${color}`, {
      ...tempList[0],
      seqNo: tableData3.value[tableData3.value.length - 1].seqNo + 1
    })) as any
    // 判断请求是否成功
    if (res.code === 200) {
      JMessage.success(res.message)
    } else {
      JMessage.error(res.message)
    }
  } else if (title === '修改') {
    console.log(tempList[0], currentTable3Row.value)

    // tempList[0]中不能有重复数据
    // let isRepeat = false
    // for (const key in tempList[0]) {
    //   if (tempList[0][key] === currentTable3Row.value[key]) {
    //     isRepeat = true
    //   }
    // }
    // if (isRepeat) {
    //   JMessage.error('不能有重复数据')
    //   return
    // }
    const res = (await LoginWork.post(`/sdStyle/optionStyleProcess?choose=${3}&style=${style}&styleColor=${color}`, {
      ...tempList[0]
    })) as any
    // 判断请求是否成功
    if (res.code === 200) {
      JMessage.success(res.message)
    } else {
      JMessage.error(res.message)
    }
  }
  // 关闭弹出框
  dialogVisible.value = false
  // 重新获取表格数据
  getTableList3()
}
const Save11 = async (arr: any, deleteArr: any) => {
  if (selectedLists11.value.length === 0) {
    JMessage.warning('请勾选数据')
    return
  }
  const res = (await LoginWork.post(`/sdStyle/renewalSiteDifference?choose=${1}`, selectedLists11.value)) as any
  // 判断请求是否成功
  if (res.code === 200) {
    JMessage.success(res.message)
    // 关闭弹出框
    // drawer2.value = false
    // 重新获取表格数据
    getSiteDifferenceList()
    formList.value[0].inputValue = `${selectedLists11.value[0].style}`
    getTableList()
  } else {
    JMessage.error(res.message)
  }
}
const confirm11 = async (obj: any, dialogVisible: any, title: any) => {
  if (selectedLists11.value.length === 0) {
    JMessage.warning('请勾选数据')
    return
  }
  // 打印出obj的值
  const tempList = formateData([obj]) as any
  // 向服务器发送请求
  if (title === '修改') {
    const res = (await LoginWork.post(`/sdStyle/renewalSiteDifference?choose=${1}`, selectedLists11.value)) as any
    // 判断请求是否成功
    if (res.code === 200) {
      JMessage.success(res.message)
      // 关闭弹出框
      drawer2.value = false
      dialogVisible.value = false
      // 重新获取表格数据
      getSiteDifferenceList()
      formList.value[0].inputValue = `${obj.style}  ${obj.styleColor}`
      getTableList()
    } else {
      JMessage.error(res.message)
    }
  }
}
const selectedLists11 = ref([]) as any
const selectTableList11 = (selectedList: any) => {
  selectedLists11.value = selectedList
}
// 删除所有
const removeCurrentStyle = async () => {
  ElMessageBox.confirm('是否删除？', {
    confirmButtonText: '确认',
    cancelButtonText: '取消',
    type: 'warning'
  })
    .then(async () => {
      const res = (await LoginWork.post('/sdStyle/deleteAllProcess', currentTableRow.value)) as any
      if (res.code === 200) {
        JMessage.success('删除成功')
        getTableList()
      } else {
        JMessage.error(res.message)
      }
    })
    .catch(() => {
      ElMessage({
        type: 'info',
        message: '取消成功'
      })
    })
}
// 删除
const removeOne = async () => {
  const { style, color } = currentTableRow.value
  // 向服务器发送请求，更新外派单信息
  const res = (await LoginWork.post(
    `/sdStyle/optionStyleProcess?choose=${2}&style=${style}&styleColor=${encodeURIComponent(color)}`,
    currentTable3Row.value
  )) as any
  // 判断请求是否成功
  if (res.code === 200) {
    JMessage.success(res.message)
    // 重新获取表格数据
    getTableList3()
  } else {
    JMessage.error(res.message)
  }
}
// JDialog更新部位差异删除
const removeOne11 = async () => {
  if (selectedLists11.value.length === 0) {
    JMessage.warning('请勾选数据')
    return
  }
  // 向服务器发送请求，更新外派单信息
  const tempList = formateData([currentTable11Row.value]) as any
  const res = (await LoginWork.post(`/sdStyle/renewalSiteDifference?choose=${2}`, selectedLists11.value)) as any
  // 判断请求是否成功
  if (res.code === 200) {
    JMessage.success(res.message)
    // 重新获取表格数据
    getSiteDifferenceList()
    getTableList3()
  } else {
    JMessage.error(res.message)
  }
}

// 抽屉模块
const drawer = ref(false)
const findClicked10 = async (content: string) => {
  if (content === '生成外发资料') {
    const res = (await LoginWork.post('/Outgoing/GenerateOutsourcedMaterials', {})) as any
    if (res.code === 200) {
      JMessage.success(res.message)
      drawer.value = false
    } else {
      JMessage.error(res.message)
    }
  }
}
const tableHeader10 = ref([
  {
    label: '指令',
    prop: 'lotNo'
  },
  {
    label: '型体',
    prop: 'style'
  },
  {
    label: '颜色',
    prop: 'color'
  },
  {
    label: '订单数',
    prop: 'orderQty'
  },
  {
    label: '外加工项目',
    prop: 'partName'
  }
])
const tableData10 = ref([])
const selectedLists10 = ref([])
const selectTableList10 = (selectedList: any) => {
  selectedLists10.value = selectedList
}
const currentTable10Row = ref({}) as any
const currentRow10 = async (row: any = tableData10.value[0]) => {
  currentTable10Row.value = row
  let table10Data = await service.post<any, any>(`/Outgoing/getNumberDetailsList`, row)
  tableData10.value = table10Data
}
// 抽屉模块2
const drawer2 = ref(false)

// 获取表格中下拉框的数据
const getCutDeptList = async () => {
  const res = (await LoginWork.get('/sdStyle/returnCutDeptList')) as any
  if (res.code === 200) {
    processOptions.value = res.data.process.map((item: any) => {
      return {
        value: item,
        label: item
      }
    })
    processOptions.value.unshift({
      value: '',
      label: ''
    })
    cutsOptions.value = res.data.cuts.map((item: any) => {
      return {
        value: item,
        label: item
      }
    })
    cutsOptions.value.unshift({
      value: '',
      label: ''
    })
    deptsOptions.value = res.data.depts.map((item: any) => {
      return {
        value: item,
        label: item
      }
    })
    deptsOptions.value.unshift({
      value: '',
      label: ''
    })
  }
}

onMounted(() => {
  getCutDeptList()
})

onBeforeUnmount(() => {
  ElMessageBox.confirm('是否保存？', {
    confirmButtonText: '确认',
    cancelButtonText: '取消',
    type: 'warning'
  })
    .then(async () => {
      const res = (await LoginWork.post(
        '/sdStyle/updatePcStyleProcess',
        tableData3.value.map((item: any) => {
          if (item.process01 && item.process1 !== '' && item.process1 === item.process001) {
            item.process1 = item.process01
          }
          if (item.process02 && item.process2 !== '' && item.process2 === item.process002) {
            item.process2 = item.process02
          }
          if (item.process03 && item.process3 !== '' && item.process3 === item.process003) {
            item.process3 = item.process03
          }
          if (item.process04 && item.process4 !== '' && item.process4 === item.process004) {
            item.process4 = item.process04
          }
          if (item.process05 && item.process5 !== '' && item.process5 === item.process005) {
            item.process5 = item.process05
          }
          if (item.process06 && item.process6 !== '' && item.process6 === item.process006) {
            item.process6 = item.process06
          }
          if (item.process07 && item.process7 !== '' && item.process7 === item.process007) {
            item.process7 = item.process07
          }
          if (item.process08 && item.process8 !== '' && item.process8 === item.process008) {
            item.process8 = item.process08
          }
          if (item.process09 && item.process9 !== '' && item.process9 === item.process009) {
            item.process9 = item.process09
          }
          if (item.process010 && item.process10 !== '' && item.process10 === item.process0010) {
            item.process10 = item.process010
          }
          return item
        })
      )) as any
      // 判断请求是否成功
      if (res.code === 200) {
        JMessage.success(res.message)
      } else {
        JMessage.error(res.message)
      }
    })
    .catch(() => {
      ElMessage({
        type: 'info',
        message: '取消保存'
      })
    })
})
</script>

<style lang="less" scoped></style>
